@import url('../../../less/base.less');
.train-rules-v2-content{
  width: 100%;
  background: #fff;
  overflow: hidden;
  height: 100%;
  >.mint-popup-right{
    width: 100%;
    height: 100%;
    display: flex;
    background: @F2;
    z-index: 3333 !important;
    flex-direction:column;
    .header-wraper{
      height: 40px;
      .header{
        width: 100%;
        height: 40px;
        background-color: @theme-color;
        color:#fff;
        line-height: 40px;
        text-align: center;
        .title{
          font-size: 16px;
          margin-right: 30px;
        }
        .back-icon{
          float: left;
          margin-left: 10px;
          font-size: 14px;
          img{
            vertical-align: middle;
          }
        }
      }
    }
    .tab-bar{
      height: 50px;
      line-height: 50px;
      background: #fff;
      >span{
        height: 48px;
        text-align: center;
        width: 50%;
        display: inline-block;
        border-bottom: 2px solid #F2F2F2;
        font-size: 14px;
        color: #6F6F6F;
      }
      >span.active{
        color: @theme-color;
        border-bottom: 2px solid @theme-color;
      }
    }
    .tab-content{
      background: #fff;
      overflow: scroll;
      .rules-text{
        width: 94%;
        margin: 0 auto;
        p{
          text-align: left;
          line-height: 28px;
        }
        p.title{
          color: #000;
          font-weight: bold;
          font-size: 16px;
        }
        p.rule.block:before{
          content: '';
          width: 6px;
          height: 6px;
          background: #CCCCCC;
          display: inline-block;
          margin: 3px 10px 3px 0;
        }
        p.rule{
          color: #757575;
          font-size: 14px;
        }
        p{
          span.high-light{
            color: @theme-color;
          }
        }
        table{
          font-size: 14px;
          width: 100%;
          border-collapse:collapse;
          thead{
            background: #F4F4F4;
            tr{
              height: 40px;
              th{
                border: 1px solid #ccc;
                text-align: center;
                color: #676767;
              }
              th.left-section{
                width: 70%;
              }
              th.left-section.w50{
                width: 50%;
              }
              th.left-section.w30{
                width: 30%;
              }
            }
          }
          tbody{
            tr{
              height: 40px;
              td{
                border: 1px solid #ccc;
                text-align: center;
                color: #676767;
                span.price{
                  color: #F7B548;
                }
                span.high-light{
                  color: @theme-color;
                }
              }
            }
          }
        }
      }
    }
  }
}